/*
 * @Description:
 * @Author: cgt
 * @Date: 2021-12-23 14:05:56
 * @LastEditors: cgt
 * @LastEditTime: 2021-12-28 18:41:03
 */
import FlowLineObject from '../objects/FlowLineObject';
import IThematic from '../IThematic';

/**
 * 流动线图层
 */
class FlowLineLayer extends IThematic {
  constructor(tool, options) {
    super(tool, options || {});
  }

  /**
   * 初始化专题图层
   * @override
   * @ignore
   */
  initLayers() {
    this.prefix = 'FlowLineLayer';
    this.sourceId = this.prefix + '_source_' + this.id;
    this.layerLineId = this.prefix + '_layer_line_' + this.id;
    this.layerLineTextId = this.prefix + '_layer_lineText_' + this.id;
    this.layerIdPrefixes = [this.prefix];
    this.layerIds = [this.layerLineId, this.layerLineTextId];
    this.initFlowLineObject();
    this.getMap().addSource(this.sourceId, {
      type: 'geojson',
      data: {
        type: 'FeatureCollection',
        features: []
      }
    });
    this.getMap().addLayer({
      id: this.layerLineId,
      type: 'line',
      source: this.sourceId,
      layout: {
        'line-cap': 'round',
        'line-join': 'round'
      },
      paint: {
        'line-pattern': this.objectId,
        'line-width': ['get', 'width'],
        'line-opacity': ['get', 'opacity'],
        'line-offset': 0
      }
    });
    this.getMap().addLayer({
      id: this.layerLineTextId,
      type: 'symbol',
      source: this.sourceId,
      filter: ['all', ['==', 'sourceType', 'LineString']],
      layout: {
        'symbol-placement': 'line',
        'icon-ignore-placement': true,
        'icon-anchor': 'center',
        'text-field': '{' + this.opts.label + '}',
        'text-size': 12,
        'text-font': ['Microsoft YaHei Regular'],
        'text-offset': [0, 0],
        'text-max-width': 8,
        'text-allow-overlap': false,
        'text-ignore-placement': false
      },
      paint: {
        'text-color': ['get', 'color']
      }
    });
  }

  /**
   * 初始化流动线
   */
  initFlowLineObject() {
    this.objectId = 'FLOW_LINE_OBJECT_ID';
    if (!this.getMap().hasImage(this.objectId)) {
      this.getMap().addImage(this.objectId, new FlowLineObject(20, 2, this.getMap()), { pixelRatio: 2 });
    }
  }
}

export default FlowLineLayer;
